import React, { Component, PureComponent } from 'react';
import { StyleSheet, Text, View, Button, DeviceEventEmitter } from 'react-native';
import { createStackNavigator } from 'react-navigation-stack';
import OthersStack from './modules/others.route';
import { Home, Home1, Home2, } from './modules/home/home.index';
import DynamicTab from './dynamic.tab';
import Setting from './modules/setting/setting.page';
import UserInfo from './modules/setting/user.info.page';

const defaultNavigationOptions = {
  headerShown: false,
  // header: <View style={{backgroundColor: 'yellow'}}><Text>My Title</Text></View>,
  headerBackTitleVisible: false,
  // headerBackground: <View style={{backgroundColor: 'yellow',height: 300}}><Text>My Title</Text></View>
}

const MainStack = createStackNavigator(
  {
    tab: {
      screen: DynamicTab,
    },
    home1: {
      screen: Home1,
      navigationOptions: {
        headerShown: true,
      }
    },
    home2: {
      screen: Home2,
      navigationOptions: {
        headerShown: true,
      }
    },
    others: {
      screen: OthersStack,
    },
    setting: {
      screen: Setting,
      navigationOptions: {
        headerShown: true,
      }
    },
    userInfo: {
      screen: UserInfo,
      navigationOptions: {
        headerShown: true,
      }
    },
  },
  {
    initialRouteName: 'tab',
    defaultNavigationOptions,
  },
);

export default MainStack;
